<template>
  <div class="invite-bg">
    <title-bar title="就位确认" :gobackshow=false></title-bar>
    <div class="invite">
      <div class="invite-member">
        <img class="invite-member-pic" :src=" avatarurl || defaulturl" alt="头像">
        <span class="invite-member-text">{{ nickname }}</span>
        <span class="invite-member-subtext">  就位确认</span>
      </div>
      <div class="invite-activity">
        <div class="invite-activity-id">活动ID: {{ activityid }}</div>
        <div class="invite-activity-info">
          <div class="invite-activity-info-text">{{ content }}</div>
          <img class="invite-activity-info-pic" :src=" images.length >= 1 ? images[0].url : defaulturl " alt="头像">
        </div>
      </div>

      <div class="invite-buttons" v-if="!memberPlaced && getRequest">
        <button class="invite-button" @click="reject">拒绝</button>
        <button class="invite-button" @click="agree">确认</button>
      </div>
      <div class="invite-text" v-else="memberPlaced">
        <div class="invite-text-subtext">已确认就位</div>
      </div>
    </div>
  </div>
</template>

<script>
import {PostServiceClass} from '../../services/post.js';
import {PostMemberService} from '../../services/postmember.js';
import {CurrentUser} from "../../services/account";
import {PostMemberPlaceConfirmService} from "../../services/postmemberplaceconfirm";
import {DEFAULT_AVATAR} from "../../const"

const AvtiveForUser = {
    Normal: 0,
    Joining: 1,
    Joined: 2,
    Master: 3
}

export default {
  components: {},
  route:{
    data({ to: { params: { postId } }}){
        this.id = postId
        this.getItem()
    }
  },
  data: function(){
    return {
      defaulturl: DEFAULT_AVATAR,
      activityid: '',
      nickname: '',
      avatarurl: '',
      content: '',
      images: [],
      activeForUser: 0,
        getRequest: false,
        memberPlaced: false,
    }
  },
  computed:{
    buttonStatus: function(){
      return this.activeForUser === AvtiveForUser.Normal
    },
  },
  methods: {
    getItem(){
        this.service.GetByLoginAsync(this.id)
            .then(({authorNickName, authorAvatarUrl, id, content, images, current}) => {
                this.nickname = authorNickName;
                this.avatarurl = authorAvatarUrl;
                this.activityid = id;
                this.content = content;
                this.images = images;
                this.activeForUser = current.avtiveForUser;
                this.getRequest = current.getRequest;
                this.memberPlaced = current.memberPlaced;
            })
    },
    reject(){
        CurrentUser()
            .then(user => {
                this.postMemberPlaceConfirmService.Reject({id: this.id, memberUserId: user.id})
                    .then((res) => {
                        window.location.reload()
                    })
            })
    },
    agree(){
        CurrentUser()
            .then(user => {
                this.postMemberPlaceConfirmService.Confirm({id: this.id, memberUserId: user.id})
                    .then((res) => {
                        window.location.reload()
                    })
            })
    }

  },
  init() {
    this.postMemberService = new PostMemberService()
    this.service = new PostServiceClass()
    this.postMemberPlaceConfirmService = new PostMemberPlaceConfirmService()
  }
}
</script>

<style lang='sass'>
    @import '../../vendor/styles/invite.scss';
</style>










